<nav id="top-nav" class="navbar navbar-expand-md mb-3">
    <div class="container justify-content-between">
        <a class="d-block navbar-brand mr-3 text-reset" href="/">
            <img id="docs-logo-icon" src="/images/logo.svg" alt="ClickHouse logo" title="ClickHouse logo"/>
        </a>
        <div class="w-100 navbar-text text-left d-none d-md-block">
            <h2 class="display-6 m-0 p-0 d-inline">
                <a href="/blog/{{ language }}/" class="text-reset text-decoration-none">
                    {{ config.site_name }}
                </a>
            </h2>
        </div>

        <div class="d-none d-md-block">
            <ul class="navbar-nav ml-auto mt-2 mt-lg-0 justify-content-end">
                <li class="nav-item">
                     <a class="nav-link text-reset"
                        href="https://github.com/ClickHouse/ClickHouse/tree/master/website/blog"
                        rel="external nofollow noreferral" target="_blank">
                        {{ _('New&nbsp;post') }}
                     </a>
                </li>
                <li class="nav-item">
                     <a class="nav-link text-reset" href="/docs/{{ language }}/">
                        {{ _('Documentation') }}
                     </a>
                </li>
                <li class="nav-item">
                     <a class="nav-link text-reset"
                        href="https://github.com/ClickHouse/ClickHouse"
                        rel="external nofollow noreferrer" target="_blank">
                        GitHub
                     </a>
                </li>
                <li id="languages-wrapper" class="nav-item dropdown">
                    <div id="languages-dropdown">
                        <a class="nav-link dropdown-toggle d-inline-block text-reset" href="#" id="lang-dropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            <img src="/images/flags/{{ language }}.svg" alt="{{ config.extra.languages[language] }}" title="{{ config.extra.languages[language] }}" width="32" class="d-inline-block mt-n1" />
                        </a>
                        <div class="dropdown-menu" aria-labelledby="lang-dropdown">
                            {% for code, name in config.extra.languages.items() %}
                            <a class="dropdown-item text-reset {% if language == code %}disabled{% endif %}"
                               href="/blog/{{ code }}/">
                                <img src="/images/flags/{{ code }}.svg" alt="" title="" width="32" class="d-inline-block mr-2" />
                                {{ name }}
                            </a>
                            {% endfor %}
                        </div>
                    </div>
                </li>
            </ul>
        </div>
    </div>
</nav>
